<template>
	<view class="page">
		<image class="login_logo" src="https://dcdn.it120.cc/haitangweiguang/login_logo.png" mode="aspectFill"></image>
		<view class="login_form">
			<image class="login_title" src="https://dcdn.it120.cc/haitangweiguang/login_title.png" mode="aspectFill"></image>
			<view class="login_box">
				<image class="login_box_img" src="https://dcdn.it120.cc/haitangweiguang/user.png" mode="aspectFill"></image>
				<input class="login_box_input" type="text" placeholder="请输入用户名"
					placeholder-style="font-size:40rpx;color:#b9b9b9;">
			</view>
			<view class="login_box">
				<image class="login_box_img" src="https://dcdn.it120.cc/haitangweiguang/pwd.png" mode="aspectFill"></image>
				<input class="login_box_input" type="text" placeholder="请输入密码"
					placeholder-style="font-size:40rpx;color:#b9b9b9;">
			</view>
			<image class="login_bt" src="https://dcdn.it120.cc/haitangweiguang/login.png" mode="aspectFill"></image>
		</view>
		<view class="login_other">
			<image class="remember"
				:src="remember?'https://dcdn.it120.cc/haitangweiguang/remember_ok.png':'https://dcdn.it120.cc/haitangweiguang/remember.png'"
				mode="aspectFill" @click="_remember()"></image>
			<image class="reset" src="https://dcdn.it120.cc/haitangweiguang/reset.png" mode="aspectFill"></image>
		</view>
		<image class="login_wx" src="https://dcdn.it120.cc/haitangweiguang/login_wx.png" mode="aspectFill"></image>
	</view>

</template>

<script>
	export default {
		data() {
			return {
				remember: false
			}
		},
		created() {

		},
		mounted() {

		},
		onReady() {},
		onLoad(e) {},
		onShow() {

		},
		methods: {
			// 是否记住密码
			_remember() {
				this.remember = !this.remember
			}
		}
	}
</script>
<style scoped lang="scss">
	.page {
		width: 100vw;
		height: 100vh;
		position: fixed;
		z-index: 0;
		top: 0;
		left: 0;
		background: url(https://dcdn.it120.cc/haitangweiguang/login_bj.png) no-repeat;
		background-size: 100%;
	}

	.login_logo {
		width: 573rpx;
		height: 533rpx;
		margin: 96rpx 88rpx 0;
	}

	.login_title {
		width: 95rpx;
		height: 32rpx;
		margin: -10rpx 0 24rpx 99rpx;
	}

	.login_box {
		width: 561rpx;
		height: 88rpx;
		margin: 0 94.5rpx 53rpx;
		background: #fff;
		border-radius: 100rpx;
		display: flex;
	}

	.login_box_img {
		width: 44rpx;
		height: 44rpx;
		margin: 22rpx 25rpx 0 25rpx;
	}

	.login_box_input {
		width: 400rpx;
		height: 88rpx;
		line-height: 88rpx;
		font-size: 40rpx;
		color: #565656;
		margin: 0 0rpx;
		display: inline-block;
	}

	.login_bt {
		width: 590rpx;
		height: 99rpx;
		margin: 10rpx 80rpx 30rpx;
	}

	.login_other {
		width: 561rpx;
		height: 55rpx;
		margin: 0 94.5rpx 30rpx;
		border-bottom: 3rpx solid #887efd;
		display: flex;
		justify-content: space-between;
	}

	.remember {
		width: 110rpx;
		height: 21rpx;
	}

	.reset {
		width: 177rpx;
		height: 22rpx;
	}

	.login_wx {
		width: 595rpx;
		height: 104rpx;
		margin: 20rpx 77.5rpx;
	}
</style>